<template>
    <Layout>
        <Form ref="queryForm" :model="dataToQuery" :label-width="120">
            <Row class="query-form">
                <Col span="8">
                    <FormItem label="企业名称：" prop="companyId">
                        <cascader-dom class="query-form-el" ref='queryOrgCascader' @setOrgInfo='setQueryCompanyName' :orgTree="true"
                                      :setCurrentName="{label:dataToQuery.companyName,value:dataToQuery.companyId}"></cascader-dom>
                    </FormItem>
                </Col>
                <Col span="8">
                    <FormItem label="年份：" prop="year" >
                        <DatePicker class="query-form-el" type="year" placeholder="请选择年份" v-model="dataToQuery.year1" :clearable="false"
                                    @on-change="()=>{if(dataToQuery.year1 instanceof Date){dataToQuery.year = dataToQuery.year1.getFullYear().toString()}}"></DatePicker>
                    </FormItem>
                </Col>
                <Col span="8" v-if="!switchFlag">
                    <Button @click="switchQuery(true)" class="ivu-btn-switch" type="text">展开∨</Button>
                    <Button @click="reset" class="ivu-btn-reset">重置</Button>
                    <Button type="primary" class="ivu-btn-query" icon="md-search" @click="query">查询</Button>
                </Col>
                <Col span="8" v-else>
                    <FormItem label='企业考核单元编号：'>
                        <Input class="query-form-el" v-model="dataToQuery.assessmentUnitNo"/>
                    </FormItem>
                </Col>
            </Row>
            <Row v-show="switchFlag" class="query-form">
                <Col span="8" offset="16">
                    <Button @click="switchQuery(false)" class="ivu-btn-switch" type="text">收起∧</Button>
                    <Button @click="reset" class="ivu-btn-reset">重置</Button>
                    <Button class="ivu-btn-query" icon="md-search" @click="query">查询</Button>
                </Col>
            </Row>
            <Row class="query-form">
                <Col span="24">
                    <Button size="large" class="ivu-btn-add" icon="md-add" @click="addInfo">新增</Button>
                    <download-button :api="exportUrl" :queryForm="dataToQuery" />
                    <!-- <Button type="primary" class="ivu-btn-add" icon="md-cloud-download" @click="exportFormSubmit">导出</Button> -->
                </Col>
            </Row>
        </Form>
        <Table ref='table' :height="tableHeight" no-data-text="没有查询到相关数据!" @on-selection-change='getSelectRows'
               :loading='pageStatus.loading' @on-expand="onExpand"
               border :columns="columns1" :data="dataTable">
        </Table>
        <!--分页-->
        <Row style="margin-right:10px;">
            <Col span="24">
                <Page style="float: right" :total="pagedata.total" :page-size="pagedata.pageSize"
                      @on-change="pageChange" @on-page-size-change="pageSizeChange" :page-size-opts="pageSizeArray"
                      show-total show-sizer show-elevator/>
            </Col>
        </Row>
        <!--新增、修改、详情-->
        <Modal :title="getModalTitle('消防宣传月活动情况汇总表')" :transfer=false :mask-closable="false"
               v-model="dialogShow" v-if="dataToView && dialogShow" :width=950 class-name='limit-height-dialog'>
            <Row>
                <Col span="24">
                    <Form ref="dialogForm" :class="mode === 'view'?'modal-view-detail':'modal-form'"
                          :show-message="false" :model="dataToView" :rules="mode === 'view'?{} :ruleCustom"
                          :label-position="mode === 'view'?'right':'top'" :label-width="mode === 'view'?160:null">

                        <Row type="flex" justify="space-around" class="code-row-bg">
                            <Col span="11">
                                <FormItem label='所属二级集团：' prop='belongOrgId'>
                                    <div v-if="mode === 'view'">{{ dataToView.belongOrgName }}</div>
                                    <Input v-else class='query-form-el' placeholder="请填写所属二级集团" type='text' readonly v-model='dataToView.belongOrgName'></Input>
                                    <!--<Select v-else class='query-form-el' placeholder="集团名称"  v-model='dataToView.belongOrgId' label-in-value @on-change="belongChange">-->
                                        <!--<Option v-for="item in twoLevel" :value="item.orgId" :key="item.orgId">{{item.orgName}}</Option>-->
                                    <!--</Select>-->
                                </FormItem>
                            </Col>
                            <Col span="11">
                                <FormItem label='单位名称：' prop='companyId'>
                                    <div v-if="mode === 'view'">{{ dataToView.companyName }}</div>
                                    <cascader-dom v-else class='query-form-el' ref='orgCascader' @setOrgInfo='setCompanyId' @setOrgname="setCompanyName" :orgTree="true"
                                                  :setCurrentName="{label:dataToView.companyName,value:dataToView.companyId}" ></cascader-dom>
                                </FormItem>
                            </Col>
                        </Row>
                        <Row type="flex" justify="space-around" class="code-row-bg">
                            <!--<Col span="11">-->
                                <!--<FormItem label='年份：' prop='year'>-->
                                    <!--<div v-if="mode === 'view'">{{ dataToView.year }}</div>-->
                                    <!--&lt;!&ndash;<Input v-else class='query-form-el' placeholder="请填写年份" type='text' v-model='dataToView.year'></Input>&ndash;&gt;-->
                                    <!--<DatePicker v-else class='query-form-el' :clearable="false" type="year" placeholder="请输入" v-model="dataToView.yearDate"></DatePicker>-->
                                <!--</FormItem>-->
                            <!--</Col>-->
                            <Col span="11">
                                <FormItem label='企业考核单元编号：'>
                                    <div v-if="mode === 'view'">{{ dataToView.assessmentUnitNo }}</div>
                                    <Input v-else class='query-form-el' placeholder="请填写企业考核单元编号" type='text' v-model='dataToView.assessmentUnitNo'></Input>
                                </FormItem>
                            </Col>
                            <Col span="11">
                                <FormItem label='宣传教育-宣传标语或横幅数量：' prop='bannersNum'>
                                    <div v-if="mode === 'view'">{{ dataToView.bannersNum }}</div>
                                    <InputNumber v-else class='query-form-el' placeholder="请填写宣传标语或横幅设置数量" min="0" type='text' v-model='dataToView.bannersNum'></InputNumber>
                                </FormItem>
                            </Col>
                        </Row>
                        <Row type="flex" justify="space-around" class="code-row-bg">
                            <Col span="11">
                                <FormItem label='会议部署-公司层面会议(次)：' prop='companyLevelMeetingsNum'>
                                    <div v-if="mode === 'view'">{{ dataToView.companyLevelMeetingsNum }}</div>
                                    <InputNumber v-else class='query-form-el' placeholder="请填写公司层面会议(次)" min="0" type='text' v-model='dataToView.companyLevelMeetingsNum'></InputNumber>
                                </FormItem>
                            </Col>
                            <Col span="11">
                                <FormItem label='会议部署-参会人次：' prop='attendeeNum'>
                                    <div v-if="mode === 'view'">{{ dataToView.attendeeNum }}</div>
                                    <InputNumber v-else class='query-form-el' placeholder="请填写参会人次" min="0" type='text' v-model='dataToView.attendeeNum'></InputNumber>
                                </FormItem>
                            </Col>
                        </Row>
                        <Row>
                            <!--<Col span="11">-->
                                <!--<FormItem :label='"宣传教育-培训主题 "+ (index+1) +"："' :prop='trainingTheme'>-->
                                    <!--<div v-if="mode === 'view'">{{ item.trainingTheme }}</div>-->
                                    <!--<Input v-else class='query-form-el' placeholder="请填写培训主题" type='text' v-model='item.trainingTheme'></Input>-->
                                <!--</FormItem>-->
                            <!--</Col>-->
                            <!--<Col span="11">-->
                                <!--<FormItem :label='"宣传教育-参与人数 "+ (index+1) +"："' :prop='eduPersonNum'>-->
                                    <!--<div v-if="mode === 'view'">{{ item.eduPersonNum }}</div>-->
                                    <!--<InputNumber v-else class='query-form-el' placeholder="请填写参与人数" min="0" type='text' v-model='item.eduPersonNum'></InputNumber>-->
                                <!--</FormItem>-->
                            <!--</Col>-->
                            <Col span="23" class="query-form" style="margin-left: 15px">
                                <FormItem label='宣传教育： (添加的每一项都不能为空)' :label-width='250' prop='edu'>
                                    <!--<b>宣传教育：</b>-->
                                    <div v-if="mode !== 'view'" class="fixed aR" style='margin-top: -30px;'>
                                        <Button class="" :disabled="dataToView.edu.length>8" size='small'
                                                @click="dataToView.edu.push({personNum: 0,themeName:null,type:1})">宣传教育新增</Button>
                                    </div>
                                </FormItem>
                                <Table highlight-row stripe border style="margin-top:10px;margin-bottom: 10px" :columns="eduColumn" :data="dataToView.edu">
                                    <template slot-scope="{ row, index }" slot="themeName">
                                        <div v-if="mode === 'view'">{{row.themeName}}</div>
                                        <Input v-else type="textarea" :autosize="{minRows:2,maxRows:5}" v-model="dataToView.edu[index].themeName" />
                                    </template>
                                    <template slot-scope="{ row, index }" slot="personNum">
                                        <div v-if="mode === 'view'">{{row.personNum}}</div>
                                        <InputNumber v-else min="0" type='text' v-model="dataToView.edu[index].personNum" />
                                    </template>
                                </Table>
                            </Col>
                        </Row>
                        <Row>
                            <!--<Col span="11">-->
                                <!--<FormItem label='预案演练-演练主题：' prop='planDrillTheme'>-->
                                    <!--<div v-if="mode === 'view'">{{ dataToView.planDrillTheme }}</div>-->
                                    <!--<Input v-else class='query-form-el' placeholder="请填写演练主题" type='text' v-model='dataToView.planDrillTheme'></Input>-->
                                <!--</FormItem>-->
                            <!--</Col>-->
                            <!--<Col span="11">-->
                                <!--<FormItem label='预案演练-参与人数：' prop='planDrillPersonNum'>-->
                                    <!--<div v-if="mode === 'view'">{{ dataToView.planDrillPersonNum }}</div>-->
                                    <!--<InputNumber v-else class='query-form-el' placeholder="请填写参与人数" min="0" type='text' v-model='dataToView.planDrillPersonNum'></InputNumber>-->
                                <!--</FormItem>-->
                            <!--</Col>-->
                            <Col span="23" class="query-form" style="margin-left: 15px">
                                <FormItem label='预案演练： (添加的每一项都不能为空)' :label-width='250' prop='planDrill'>
                                    <!--<b>预案演练：</b>-->
                                    <div v-if="mode !== 'view'" class="fixed aR" style='margin-top: -30px;'>
                                        <Button class="" :disabled="dataToView.planDrill.length>8" size='small'
                                                @click="dataToView.planDrill.push({personNum: 0,themeName:null,type:2})">预案演练新增</Button>
                                    </div>
                                </FormItem>
                                <Table highlight-row stripe border style="margin-top:10px;margin-bottom: 10px" :columns="planDrillColumn" :data="dataToView.planDrill">
                                    <template slot-scope="{ row, index }" slot="themeName">
                                        <div v-if="mode === 'view'">{{row.themeName}}</div>
                                        <Input v-else type="textarea" :autosize="{minRows:2,maxRows:5}" v-model="dataToView.planDrill[index].themeName" />
                                    </template>
                                    <template slot-scope="{ row, index }" slot="personNum">
                                        <div v-if="mode === 'view'">{{row.personNum}}</div>
                                        <InputNumber v-else min="0" type='text' v-model="dataToView.planDrill[index].personNum" />
                                    </template>
                                </Table>
                            </Col>
                        </Row>
                        <Row>
                            <!--<Col span="11">-->
                                <!--<FormItem label='参观体验-主题：' prop='visitExperienceTheme'>-->
                                    <!--<div v-if="mode === 'view'">{{ dataToView.visitExperienceTheme }}</div>-->
                                    <!--<Input v-else class='query-form-el' placeholder="请填写参观体验主题" type='text' v-model='dataToView.visitExperienceTheme'></Input>-->
                                <!--</FormItem>-->
                            <!--</Col>-->
                            <!--<Col span="11">-->
                                <!--<FormItem label='参观体验-参与人数：' prop='visitExperiencePersonNum'>-->
                                    <!--<div v-if="mode === 'view'">{{ dataToView.visitExperiencePersonNum }}</div>-->
                                    <!--<InputNumber v-else class='query-form-el' placeholder="请填写参与人数" min="0" type='text' v-model='dataToView.visitExperiencePersonNum'></InputNumber>-->
                                <!--</FormItem>-->
                            <!--</Col>-->
                            <Col span="23" class="query-form" style="margin-left: 15px">
                                <FormItem label='参观体验： (添加的每一项都不能为空)' :label-width='250' prop='visitExperience'>
                                    <!--<b>参观体验：</b>-->
                                    <div v-if="mode !== 'view'" class="fixed aR" style='margin-top: -30px;'>
                                        <Button class="" :disabled="dataToView.visitExperience.length>8" size='small'
                                                @click="dataToView.visitExperience.push({personNum: 0,themeName:null,type:3})">参观体验新增</Button>
                                    </div>
                                </FormItem>
                                <Table highlight-row stripe border style="margin-top:10px;margin-bottom: 10px" :columns="visitExperienceColumn" :data="dataToView.visitExperience">
                                    <template slot-scope="{ row, index }" slot="themeName">
                                        <div v-if="mode === 'view'">{{row.themeName}}</div>
                                        <Input v-else type="textarea" :autosize="{minRows:2,maxRows:5}" v-model="dataToView.visitExperience[index].themeName" />
                                    </template>
                                    <template slot-scope="{ row, index }" slot="personNum">
                                        <div v-if="mode === 'view'">{{row.personNum}}</div>
                                        <InputNumber v-else min="0" type='text' v-model="dataToView.visitExperience[index].personNum" />
                                    </template>
                                </Table>
                            </Col>
                        </Row>

                        <Row>
                            <Col span="23" class="query-form" style="margin-left: 15px">
                                <FormItem label='发现隐患和问题及整改：' :label-width='170'></FormItem>
                                <Table highlight-row stripe border style="margin-top:10px;margin-bottom: 10px" :columns="itemColumn" :data="dataToView.items">
                                    <template slot-scope="{ row, index }" slot="problemNum">
                                        <div v-if="mode === 'view'">{{row.problemNum}}</div>
                                        <InputNumber v-else min="0" v-model="dataToView.items[index].problemNum" />
                                    </template>
                                    <template slot-scope="{ row, index }" slot="problemRectifyNum">
                                        <div v-if="mode === 'view'">{{row.problemRectifyNum}}</div>
                                        <InputNumber v-else min="0" :max="dataToView.items[index].problemNum" v-model="dataToView.items[index].problemRectifyNum" />
                                    </template>
                                    <template slot-scope="{ row, index }" slot="remark">
                                        <div v-if="mode === 'view'">{{row.remark}}</div>
                                        <Input v-else type="textarea" :autosize="{minRows:2,maxRows:5}" v-model="dataToView.items[index].remark" />
                                    </template>
                                </Table>
                            </Col>

                        </Row>

                        <Row type="flex" justify="space-around" class="code-row-bg">
                            <Col span="11">
                                <FormItem label='填报人：' prop='createUserName'>
                                    <div v-if="mode === 'view'">{{ dataToView.createUserName }}</div>
                                    <Input v-else class='query-form-el' placeholder="请填写填报人" type='text' readonly
                                           v-model='dataToView.createUserName'></Input>
                                </FormItem>
                            </Col>
                            <Col span="11">
                                <FormItem label='填报时间：' prop='createDate'>
                                    <div v-if="mode === 'view'">{{ renderViewDate(dataToView.createDate) }}</div>
                                    <DatePicker v-else class="query-form-el" placeholder="请选择填报时间" readonly
                                                v-model='dataToView.createDate'></DatePicker>
                                </FormItem>
                            </Col>
                        </Row>
                    </Form>
                </Col>
            </Row>
            <div slot="footer">
                <Button v-if="mode != 'view'" type="primary" class='ivu-btn-save' @click="submit('dialogForm')">确定</Button>
                <Button v-if="mode != 'view'" type="primary" class='ivu-btn-cancel' @click="handleCancel">取消</Button>
                <Button v-if="mode === 'view'" class='ivu-btn-save' @click="dialogShow=false">关闭</Button>
            </div>
        </Modal>

    </Layout>
</template>

<script>
    import {Api} from '@/api/index.js'
    import {sessionStorage} from '@/common/cacheUtils.js';
    import {formatDate} from '@/tools/index'
    var cascaderDom = () => import('@/components/cascader-dom.vue');
    import pageCommonFunction from '@/components/pageCommonFunction.js'

    export default {
        components: {cascaderDom},
        data() {
            return {
                ...this.createCommonDataField(),
                columns1: [
                    // {type:'expand', width:30,
                    //     fixed: 'left',
                    //     render:(h,params)=>{
                    //         return h('Table',{
                    //             props: {
                    //                 columns: [
                    //                     { key:'problemCategory',title: '发现隐患和问题类别',  align: 'left', width: 180,  },
                    //                     { key:'problemNum',title: '数量',  align: 'center', width: 90,  },
                    //                     { key:'problemRectifyNum',title: '整改数量',  align: 'center', width: 90,  },
                    //                     { key:'remark',title: '备注',  align: 'left', minWidth: 140,  },
                    //                 ],//表头
                    //                 data: params.row.items,//内部表格展示的数据
                    //             },
                    //         })
                    //     }
                    // },
                    {title: '序号', width: 80, fixed: 'left', align: 'center', render: (h, params) => {
                            if (params.row.id === '-1') return h('span', "汇总");
                            return h('span', (params.index ) + (this.pagedata.currentPage - 1) * this.pagedata.pageSize + 1);
                        }
                    },
                    { key:'belongOrgName',title: '所属二级集团',  align: 'center', minWidth: 140,  },
                    { key:'companyName',title: '企业名称',  align: 'center', minWidth: 140,  },
                    { key:'assessmentUnitNo',title: '企业考核单元编号',  align: 'center', minWidth: 120,  },
                    { title: '会议部署',  align: 'center', minWidth: 120, children:[
                            { key:'companyLevelMeetingsNum',title: '公司层面会议(次)',  align: 'center', minWidth: 100,  },
                            { key:'attendeeNum',title: '参会人次',  align: 'center', minWidth: 90,  },
                        ] },
                    { key:'bannersNum',title: '宣传标语或横幅设置数量',  align: 'center', minWidth: 100,  },
                    // { title: '宣传教育',  align: 'center', minWidth: 120, children:[
                    //         { key:'bannersNum',title: '宣传标语或横幅设置数量',  align: 'center', minWidth: 100,  },
                    //         { key:'trainingTheme',title: '培训主题',  align: 'center', minWidth: 120,tooltip:true  },
                    //         { key:'eduPersonNum',title: '参与人数',  align: 'center', minWidth: 90,  },
                    //     ] },
                    // { title: '预案演练',  align: 'center', minWidth: 120, children:[
                    //         { key:'planDrillTheme',title: '演练主题',  align: 'center', minWidth: 120, tooltip:true  },
                    //         { key:'planDrillPersonNum',title: '参与人数',  align: 'center', minWidth: 90,  },
                    //     ] },
                    // { title: '参观体验',  align: 'center', minWidth: 120, children:[
                    //         { key:'visitExperienceTheme',title: '参观体验主题',  align: 'center', minWidth: 120,tooltip:true},
                    //         { key:'visitExperiencePersonNum',title: '参与人数',  align: 'center', minWidth: 90,  },
                    //     ] },
                    { key:'year',title: '年份',  align: 'center', minWidth: 80,  },
                    this.getActionColumns((params) => {return params.row.id === '-1'})
                ],
                ruleCustom: {
                    companyId: [ { required: true, message: '请填写单位名称', trigger: 'change',}],
                    // belongOrgId: [ { required: true, message: '请填写所属二级集团', trigger: 'change',}],
                    yearDate: [ { required: true, message: '请填写年份', trigger: 'change',type:'date'}],
                    assessmentUnitNo: [ { required: true, message: '请填写企业考核单元编号', trigger: 'change',}],
                    companyLevelMeetingsNum: [ { required: true, message: '请填写公司层面会议(次)', trigger: 'change',type:'number'}],
                    attendeeNum: [ { required: true, message: '请填写参会人次', trigger: 'change',type:'number'}],
                    bannersNum: [ { required: true, message: '请填写宣传标语或横幅设置数量', trigger: 'change',type:'number'}],
                    edu: [{
                        validator: (rule, value, callback) => {
                            for (let k in this.dataToView.edu) {
                                if (!this.dataToView.edu[k].themeName) {
                                    callback(new Error('请填写宣传教育中的每一项'));
                                }
                            }
                            callback();
                        }, required: true, trigger: 'blue'
                    }],
                    planDrill: [{
                        validator: (rule, value, callback) => {
                            for (let k in this.dataToView.planDrill) {
                                if (!this.dataToView.planDrill[k].themeName) {
                                    callback(new Error('请填写预案演练中的每一项'));
                                }
                            }
                            callback();
                        },  required: true,trigger: 'blue'
                    }],
                    visitExperience: [{
                        validator: (rule, value, callback) => {
                            for (let k in this.dataToView.visitExperience) {
                                if (!this.dataToView.visitExperience[k].themeName) {
                                    callback(new Error('请填写参观体验中的每一项'));
                                }
                            }
                            callback();
                        },  required: true,trigger: 'blue'
                    }],
                    // trainingTheme: [ { required: true, message: '请填写培训主题', trigger: 'change',}],
                    // eduPersonNum: [ { required: true, message: '请填写参与人数', trigger: 'change',type:'number'}],
                    // planDrillTheme: [ { required: true, message: '请填写演练主题', trigger: 'change',}],
                    // planDrillPersonNum: [ { required: true, message: '请填写参与人数', trigger: 'change',type:'number'}],
                    // visitExperienceTheme: [ { required: true, message: '请填写参观体验主题', trigger: 'change',}],
                    // visitExperiencePersonNum: [ { required: true, message: '请填写参与人数', trigger: 'change',type:'number'}],
                },
                tableHeight: 10,
                itemColumn:[
                    { key:'problemCategory',title: '发现隐患和问题类别',  align: 'left', width: 160,  },
                    { slot:'problemNum',title: '数量',  align: 'center', width: 110,  },
                    { slot:'problemRectifyNum',title: '隐患和问题整改数量',  align: 'center', width: 110,  },
                    { slot:'remark',title: '备注',  align: 'left', minWidth: 140, },
                ],
                eduColumn1:[
                    { slot:'themeName',title: '培训主题',  align: 'left', minWidth: 140, },
                    { slot:'personNum',title: '参与人数',  align: 'center', width: 110,  },
                    {title: '操作', key: 'action', align: 'center', width: 70, render: (h, params) => {
                            return h('div', [h('A', {
                                    props: {type: 'primary', size: 'small'},
                                    style: {fontSize: '13px', color: 'red'},
                                    on: {click: () => {
                                            if (this.dataToView.edu.length === 1) {
                                                this.$Message.error('宣传教育最后一项不可删除');
                                            }else {
                                                this.$Modal.confirm({
                                                    title: '提示',
                                                    content: '<p>确认删除此行数据？</p>',
                                                    onOk: () => {
                                                        this.dataToView.edu.splice(params.index, 1)
                                                    }
                                                })
                                            }
                                        }}
                                }, '删除'),
                            ])}}
                ],
                planDrillColumn1:[
                    { slot:'themeName',title: '演练主题',  align: 'left', minWidth: 140, },
                    { slot:'personNum',title: '参与人数',  align: 'center', width: 110,  },
                    {title: '操作', key: 'action', align: 'center', width: 70, render: (h, params) => {
                            return h('div', [h('A', {
                                props: {type: 'primary', size: 'small'},
                                style: {fontSize: '13px', color: 'red'},
                                on: {click: () => {
                                        if (this.dataToView.planDrill.length === 1) {
                                            this.$Message.error('预案演练最后一项不可删除');
                                        }else {
                                            this.$Modal.confirm({
                                                title: '提示',
                                                content: '<p>确认删除此行数据？</p>',
                                                onOk: () => {
                                                    this.dataToView.planDrill.splice(params.index, 1)
                                                }
                                            })
                                        }
                                    }}
                            }, '删除'),])}}
                ],
                visitExperienceColumn1:[
                    { slot:'themeName',title: '参观体验主题',  align: 'left', minWidth: 140, },
                    { slot:'personNum',title: '参与人数',  align: 'center', width: 110,  },
                    {title: '操作', key: 'action', align: 'center', width: 70, render: (h, params) => {
                            return h('div', [h('A', {
                                props: {type: 'primary', size: 'small'},
                                style: {fontSize: '13px', color: 'red'},
                                on: {click: () => {
                                        if (this.dataToView.visitExperience.length === 1) {
                                            this.$Message.error('参观体验最后一项不可删除');
                                        }else {
                                            this.$Modal.confirm({
                                                title: '提示',
                                                content: '<p>确认删除此行数据？</p>',
                                                onOk: () => {
                                                    this.dataToView.visitExperience.splice(params.index, 1)
                                                }
                                            })
                                        }
                                    }}
                            }, '删除'),])}}
                ],
                dictMap:{},
                // api
                exportUrl: Api.exportFireMonthSummary,
                queryUrl: Api.queryFireMonthSummary,
                deleteUrl: Api.deleteFireMonthSummary,
                updateUrl: Api.updateFireMonthSummary,
                saveUrl: Api.saveFireMonthSummary,

            }
        },
        computed:{
            eduColumn() {
                const columns = [...this.eduColumn1];
                const eduColumn = []
                columns.forEach(item => {
                    if (this.mode !== 'view') {eduColumn.push(item)
                    } else {if (item.title !=='操作') eduColumn.push(item)}
                })
                return eduColumn
            },
            planDrillColumn() {
                const columns = [...this.planDrillColumn1];
                const planDrillColumn = []
                columns.forEach(item => {
                    if (this.mode !== 'view') {planDrillColumn.push(item)
                    } else {if (item.title !=='操作') planDrillColumn.push(item)}
                })
                return planDrillColumn
            },
            visitExperienceColumn() {
                const columns = [...this.visitExperienceColumn1];
                const visitExperienceColumn = []
                columns.forEach(item => {
                    if (this.mode !== 'view') {visitExperienceColumn.push(item)
                    } else {if (item.title !=='操作') visitExperienceColumn.push(item)}
                })
                return visitExperienceColumn
            },
        },
        async mounted() {
            this.setTableHeight();
            this.query();
        },
        methods: {
            ...pageCommonFunction,
            // 展开原生事件  点击左侧展收起
            onExpand(row, status){
                if(status){
                    this.dataTable.splice()
                    this.dataTable.filter((item, index)=>{
                        if(item.id == row.id){
                            item._expanded = true;   //展开选中的行
                        }else{
                            item._expanded = false;   //其他行关闭
                        }
                        return item;
                    });
                }else{
                    this.dataTable.splice()
                    this.dataTable.map((item, index)=>{
                        if(item.id == row.id){
                            item._expanded = false;   //展开选中的行
                        }else{
                            item._expanded = false;   //其他行关闭
                        }
                        return item;
                    });
                }
            },
            deleteData(params) {
                this.deleteDateAjax(params);
            },
            query() {
                this.queryAjax();
            },
            submit(name) {
                this.dataToView.themeMap={
                    '1':this.dataToView.edu,
                    '2':this.dataToView.planDrill,
                    '3':this.dataToView.visitExperience
                }
                this.submitAjax(name);
            },
            async beforeViewDialogOpen(data) {
                data.row.edu = data.row.themeMap && data.row.themeMap['1']||[]
                data.row.planDrill = data.row.themeMap && data.row.themeMap['2']||[]
                data.row.visitExperience = data.row.themeMap && data.row.themeMap['3']||[]
            },
            async beforeEditDialogOpen(data) {
                data.row.edu = data.row.themeMap && data.row.themeMap['1']||[]
                data.row.planDrill = data.row.themeMap && data.row.themeMap['2']||[]
                data.row.visitExperience = data.row.themeMap && data.row.themeMap['3']||[]
            },
            createEmptyDataToAdd() {
                return {
                    companyLevelMeetingsNum: 0,
                    attendeeNum: 0,
                    bannersNum:0,
                    // eduPersonNum: 0,
                    // planDrillPersonNum: 0,
                    // visitExperiencePersonNum:0,
                    id: this.get_uuid(),
                    idFiles: [],
                    year:new Date().getFullYear(),
                    edu: [{personNum: 0,themeName:null,type:1}],
                    planDrill: [{personNum: 0,themeName:null,type:2}],
                    visitExperience: [{personNum: 0,themeName:null,type:3}],
                    items:[
                        {problemNum:0,problemRectifyNum:0,remark:'',num:1,problemCategory:'1.建(构)筑物'},
                        {problemNum:0,problemRectifyNum:0,remark:'',num:2,problemCategory:'2.场所环境缺陷类'},
                        {problemNum:0,problemRectifyNum:0,remark:'',num:3,problemCategory:'3.设备设施缺陷类'},
                        {problemNum:0,problemRectifyNum:0,remark:'',num:4,problemCategory:'4.消防设备设施器材'},
                        {problemNum:0,problemRectifyNum:0,remark:'',num:5,problemCategory:'5.电气类'},
                        {problemNum:0,problemRectifyNum:0,remark:'',num:6,problemCategory:'6.安全报警装置类'},
                        {problemNum:0,problemRectifyNum:0,remark:'',num:7,problemCategory:'7.可燃易燃杂物未及时清理'},
                        {problemNum:0,problemRectifyNum:0,remark:'',num:8,problemCategory:'8.消防通道堵塞'},
                        {problemNum:0,problemRectifyNum:0,remark:'',num:9,problemCategory:'9.其他'}
                    ]
                }
            },
            async afterDataToViewInit() {
                // await this.getFiles1('id', 'examSelect');
            },
    }
    }
</script>

<style lang='css' scoped>
    @import '../../../../index.css';
</style>
